var vm = new Vue({
    el: '#app',
    data: {
        todos: [{
                id: 1,
                content: '唧唧复唧唧，木兰当户织',
                f: true
            },
            {
                id: 2,
                content: '不闻机杼声，惟闻女叹息',
                f: true
            },
            {
                id: 3,
                content: '问女何所思，问女何所忆',
                f: true
            }
        ],
        addItem: '',
        maskFlag: false,
        inputFlag: false,
        activeIndex: -1,
        type: 'A',
        tabBars: [{
                id: 1,
                text: 'A',
                style: 'success'
            },
            {
                id: 2,
                text: 'F',
                style: 'primary'
            },
            {
                id: 3,
                text: 'U',
                style: 'danger'
            }
        ]
    },
    methods: {
        add() {
            this.todos.push({
                id: this.todos.length + 1,
                content: this.addItem,
            })

        },
        check(index) {
            //判断我们的事情是否已完成
            if (this.todos[index].f) {
                this.remove(index)
            } else {
                this.maskFlag = true
            }
        },
        remove(index) {
            this.todos.splice(index, 1)
        },
        confirm(index) {
            this.remove(index)
        }
    },
    // computed: {
    //     finished() {
    //         return this.todos.filter(function(value) {
    //             return item.f ? item : false
    //         })
    //     },
    //     unFinished() {
    //         return this.todos.filter(function(item) {
    //             return !item.f ? item : false
    //         })
    //     },
    computed: {
        finished() {
            return this.todos.filter(function(item) {
                return item.f ? item : false
            })
        },
        unFinished() {
            return this.todos.filter(function(item) {
                return !item.f ? item : false
            })
        },
        newTodos() {
            switch (this.type) {
                case "A":
                    return this.todos
                    break;
                case "F":
                    return this.finished
                    break;
                case "U":
                    return this.unFinished
                    break;

                default:
                    break;
            }
        }
    },
    mounted: function() {
        this.$nextTick(function() {
            console.log(this)
        })
    }
});

// var but = document.getElementById('#jfh-button')
// but.onclick = function() {
//     console.log(123)
// }

var fn = function() {
    vm.inputFlag = !vm.inputFlag
}